<template>
  <div class="div-cancel-botton" v-bind:id='ddhm'>
    <button class="mint-button mint-button--default mint-button--large is-plain" style="height: 30px;" @click="cancelOrder(ddhm)">
      <label class="mint-button-text">取消订单</label>
    </button>
  </div>
</template>
<script>
import axios from "axios";
import { Indicator } from "mint-ui";
import { Toast } from "mint-ui";
import { Loadmore } from "mint-ui";
import { MessageBox } from "mint-ui";
export default {
  props: ["ddhm"],
  data() {
    return {};
  },
  methods: {
    cancelOrder(ddhm) {
      let global_members_id = JSON.parse(
        localStorage.getItem("global_members_id")
      );
      MessageBox.confirm("确定取消该订单吗？").then(action => {
        axios({
          method: "post",
          url: "/api/My/Order/cancel.htm",
          params: {
            id: global_members_id,
            lxsuserid: "",
            ddbh: ddhm
          }
        }).then(res => {
          res = res.data;
          console.log(res);
          if (res.zt === "true") {
            Indicator.close();
            let instance = Toast({
              message: "取消成功"
            });
            $("div").remove("#" + ddhm);
            this.$emit("ddhmfalg", ddhm);
            setTimeout(() => {
              instance.close();
            }, 2000);
          } else {
            Indicator.close();
            let instance = Toast({
              message: "取消失败"
            });
            setTimeout(() => {
              instance.close();
            }, 2000);
          }
        });
      });
    }
  }
};
</script>

<style scoped>
.div-cancel-botton {
  overflow: hidden;
  padding-bottom: 2%;
  padding-top: 2%;
  border-bottom: 1px solid #eee;
  float: right;
  padding-right: 15px;
  height: 30px;
}
</style>
